<template>
  <div class="app-container">
    <!--    <el-button type="primary" @click="handleDown()">批量下载</el-button>-->
    <el-form style="float: right" :inline="true" :model="formSearch" class="demo-form-inline">
      <el-form-item prop="areaSelect1">
        <area-select
          ref="areaselect"
          :area-num="formSearch.provCode"
          :area-name="formSearch.provName"
          :city-num="formSearch.cityCode"
          placeholder="请选择企业注册地"
          @getAreaSelect="getAreaSelect2"
        />
      </el-form-item>
      <el-form-item>
        <el-date-picker
          v-model="year"
          type="year"
          format="yyyy"
          value-format="yyyy"
          placeholder="选择年"
          style="width: 150px;"
          @change="changYear"
        />
      </el-form-item>
      <el-form-item>
        <el-date-picker
          v-model="startTime"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择开始时间"
          style="width: 150px;"
          @change="changYear"
        />
      </el-form-item>
      <el-form-item>
        <el-date-picker
          v-model="endTime"
          type="date"
          format="yyyy-MM-dd"
          value-format="yyyy-MM-dd"
          placeholder="选择j结束时间"
          style="width: 150px;"
          @change="changYear"
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="searchFetchData()">查询</el-button>
        <el-button type="primary" @click="searchReset()">重置</el-button>
        <template v-if="allBtn === true">
          <el-button type="primary" @click="all()">导出Excel</el-button>
        </template>
      </el-form-item>
    </el-form>
    <el-table
      v-loading="listLoading"
      :data="list"
      element-loading-text="Loading"
      border
      fit
      highlight-current-row
    >
      <el-table-column label="企业名称" align="center">
        <template slot-scope="scope">
          {{ scope.row.entName }}
        </template>
      </el-table-column>
      <el-table-column label="地区" align="center">
        <template slot-scope="scope">
          <span>{{ scope.row.provName }}-{{ scope.row.cityName }}-{{ scope.row.distName }}</span>
        </template>
      </el-table-column>
      <el-table-column label="电话" align="center" width="110">
        <template slot-scope="scope">
          <span>{{ scope.row.contactsTel }}</span>
        </template>
      </el-table-column>
      <el-table-column label="手机" align="center" width="100">
        <template slot-scope="scope">
          <span>{{ scope.row.contactsMobile }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" label="企业类型" width="110">
        <template slot-scope="scope">
          <span>{{ scope.row.entTypeName }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="企业规模" width="110">
        <template slot-scope="scope">
          <span>{{ scope.row.entScaleName }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="年度" width="100">
        <template slot-scope="scope">
          <span>{{ scope.row.creatorId }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="填报时间" width="160">
        <template slot-scope="scope">
          <span>{{ scope.row.createTime }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="诊断时间" width="160">
        <template slot-scope="scope">
          <span>{{ scope.row.updateTime }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" prop="created_at" label="操作" width="110">
        <template slot-scope="scope">
          <el-button-group>
            <el-button :loading="loading" type="primary" size="mini" @click="onOne(scope.row.userId, scope.row.creatorId, scope.row.cityCode)">诊断详情</el-button>
          </el-button-group>
        </template>
      </el-table-column>
    </el-table>
    <Pagination
      ref="paging"
      :current-page="currentPage"
      :total="total"
      :limit="limit"
      @handleCurrentChange="handleCurrentChange"
      @handleSizeChange="handleSizeChange"
    />
  </div>
</template>
<script>
import { alreadyCreate, resExcel } from '@/api/diagnosis'
import Pagination from '@/components/Pagination'
import AreaSelect from '@/components/AreaSelect'
import Excel from '@/utils/excel'
import { parseTime } from '@/utils'
export default {
  name: 'DiagnosisNotCreate',
  components: {
    Pagination,
    AreaSelect
  },
  data() {
    return {
      formSearch: {
        entName: '',
        areaSelect1: ''
      },
      year: '',
      startTime: '',
      endTime: '',
      currentPage: 1,
      limit: 10,
      total: 0,
      list: null,
      listLoading: false,
      loading: false,
      allBtn: false
    }
  },
  created() {
    if (this.$route.query.pageN) { this.currentPage = this.$route.query.pageN - 0 }
  },
  methods: {
    fetchData() {
      this.listLoading = true
      let cityC = ''
      if (this.formSearch.areaSelect1.cityCode !== undefined && this.formSearch.areaSelect1.cityCode !== '0') {
        cityC = this.formSearch.areaSelect1.cityCode
      }
      alreadyCreate({ provCode: this.formSearch.areaSelect1.areaCode, cityCode: cityC, year: this.year, startTime: this.startTime, endTime: this.endTime, currentPage: this.currentPage }).then(response => {
        if (response.result === 1) {
          this.total = response.data.total
          this.list = response.data.list
          if (this.total > 0 && cityC !== '') {
            this.allBtn = true
          } else {
            this.allBtn = false
          }
          this.listLoading = false
        } else {
          this.allBtn = false
        }
        this.listLoading = false
      }).catch(() => {
        this.allBtn = false
        this.listLoading = false
      })
    },
    searchFetchData() {
      this.fetchData()
    },
    searchReset() {
      this.formSearch.provCode = ''
      this.formSearch.provName = ''
      this.formSearch.cityCode = ''
      this.formSearch.cityName = ''
      this.formSearch.areaSelect1 = []
      this.$set(this.formSearch.areaSelect1, 'areaCode', this.formSearch.provCode)
      this.$set(this.formSearch.areaSelect1, 'areaName', this.formSearch.provName)
      this.$set(this.formSearch.areaSelect1, 'cityCode', this.formSearch.cityCode)
      this.$set(this.formSearch.areaSelect1, 'cityName', this.formSearch.cityName)
      this.$refs.areaselect.resetForm()
      this.formSearch.entName = ''
      this.fetchData()
    },
    getAreaSelect2(msg) { // msg就是传过来的数据了  这只是个形参  名字可以随意
      this.formSearch.areaSelect1 = msg// 然后将数据赋值给chindVal
    },
    handleCurrentChange(val) {
      this.currentPage = val
      this.fetchData()
    },
    handleSizeChange(val) {
      this.limit = val
      this.currentPage = 1
      this.fetchData()
    },
    all() {
      let cityC = ''
      if (this.formSearch.areaSelect1.cityCode !== undefined && this.formSearch.areaSelect1.cityCode !== '0') {
        cityC = this.formSearch.areaSelect1.cityCode
      }
      if (cityC === '') {
        this.$message({
          message: '请选择市', type: 'warning'
        })
        this.listLoading = false
        return
      }
      const loading = this.$loading({
        lock: true,
        text: '导出Excel中',
        spinner: 'el-icon-loading',
        background: 'rgba(0, 0, 0, 0.7)'
      })
      resExcel({ cityCode: cityC, year: this.year, startTime: this.startTime, endTime: this.endTime }).then(response => {
        console.log(response)
        if (response.result === 1) {
          Excel.diagnosisResultExcel(response.data, this.formSearch.areaSelect1.areaName + this.formSearch.areaSelect1.cityName + '专精特新企业评测结果' + parseTime(new Date(), '{y}{m}{d}{h}{i}{s}'))
          loading.close()
          this.$message({
            message: '导出完成', type: 'success'
          })
        } else {
          loading.close()
          this.$message({
            message: response.msg, type: 'warning'
          })
        }
      }).catch(() => {
        loading.close()
      })
    },
    onOne(userId, year, cityCode) {
      this.$router.push({ name: 'SubmittedDetails', query: { userId: userId, year: year, cityCode: cityCode, pageN: this.currentPage }})
    },
    changYear(e) {
      console.log(e)
    }
  }
}
</script>
